<?php
use yii\helpers\Url;
?>
<div class="row bottom-10">
    <div class="col-xs-12">
        <div class="banner">
            <label>GIỎ HÀNG</label>
        </div>
    </div>
</div>
<div id="cart">
    <form id="book" class="bottom-40">
        <table class="table table-hover">
            <thead>
                <tr>
                    <th class="col-xs-1">Chọn</th>
                    <th class="col-xs-7">Sản phẩm</th>
                    <th class="col-xs-2">Giá</th>
                    <th class="col-xs-2">Tổng giá</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <th scope="row"><input type="checkbox" /></th>
                    <td>
                        <div class="row">
                            <div class="col-xs-4"><img src="<?php echo Url::to('@web/images/1.jpg');?>" class="img-responsive"></div>
                            <div class="col-xs-8">
                                <label class="bottom-10">Áo Khoác Nỉ Nam Giả Vest Áo Khoác Nỉ Nam Giả Vest Áo Khoác Nỉ Nam Giả Vest</label>
                                <div class="row bottom-5">
                                    <label class="col-xs-4 book-label">SỐ LƯỢNG</label>
                                    <div class="col-xs-3">
                                        <input type="number" required="required" class="col-xs-12" min="1" value="1">
                                    </div>
                                </div>
                                <div class="row bottom-5">
                                    <label class="col-xs-4 book-label">KÍCH THƯỚC</label>
                                    <div class="col-xs-8 size">
                                        <input type="radio" id="size-1" name="size" value="S"/>
                                        <label for="size-1"><div class="size">S</div></label>
                                        <input type="radio" id="size-2" name="size" value="M"/>
                                        <label for="size-2"><div class="size">M</div></label>
                                        <input type="radio" id="size-3" name="size" value="L"/>
                                        <label for="size-3"><div class="size">L</div></label>
                                    </div>
                                </div>
                                <div class="row bottom-5">
                                    <label class="col-xs-4 book-label">MÀU SẮC</label>
                                    <div class="col-xs-8">
                                        <input type="radio" id="color-1" name="color" value="1"/>
                                        <label for="color-1"><div class="color" style="background-color: #11121E"></div></label>
                                        <input type="radio" id="color-2" name="color" value="2"/>
                                        <label for="color-2"><div class="color" style="background-color: #B5AE9E"></div></label>
                                        <input type="radio" id="color-3" name="color" value="3"/>
                                        <label for="color-3"><div class="color" style="background-color: #402E2A"></div></label>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </td>
                    <td>560,000</td>
                    <td>560,000</td>
                </tr>
                <tr>
                    <th scope="row"><input type="checkbox" /></th>
                    <td>
                        <div class="row">
                            <div class="col-xs-4"><img src="<?php echo Url::to('@web/images/1.jpg');?>" class="img-responsive"></div>
                            <div class="col-xs-8">
                                <label class="bottom-10">Áo Khoác Nỉ Nam Giả Vest Áo Khoác Nỉ Nam Giả Vest Áo Khoác Nỉ Nam Giả Vest</label>
                                <div class="row bottom-5">
                                    <label class="col-xs-4 book-label">SỐ LƯỢNG</label>
                                    <div class="col-xs-3">
                                        <input type="number" required="required" class="col-xs-12" min="1" value="1">
                                    </div>
                                </div>
                                <div class="row bottom-5">
                                    <label class="col-xs-4 book-label">KÍCH THƯỚC</label>
                                    <div class="col-xs-8 size">
                                        <input type="radio" id="size-1-2" name="size" value="S"/>
                                        <label for="size-1-2"><div class="size">S</div></label>
                                        <input type="radio" id="size-2-2" name="size" value="M"/>
                                        <label for="size-2-2"><div class="size">M</div></label>
                                        <input type="radio" id="size-3-2" name="size" value="L"/>
                                        <label for="size-3-2"><div class="size">L</div></label>
                                    </div>
                                </div>
                                <div class="row bottom-5">
                                    <label class="col-xs-4 book-label">MÀU SẮC</label>
                                    <div class="col-xs-8">
                                        <input type="radio" id="color-1-2" name="color" value="1"/>
                                        <label for="color-1-2"><div class="color" style="background-color: #11121E"></div></label>
                                        <input type="radio" id="color-2-2" name="color" value="2"/>
                                        <label for="color-2-2"><div class="color" style="background-color: #B5AE9E"></div></label>
                                        <input type="radio" id="color-3-2" name="color" value="3"/>
                                        <label for="color-3-2"><div class="color" style="background-color: #402E2A"></div></label>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </td>
                    <td>560,000</td>
                    <td>560,000</td>
                </tr>
                <tr>
                    <th scope="row"><input type="checkbox" /></th>
                    <td>
                        <div class="row">
                            <div class="col-xs-4"><img src="<?php echo Url::to('@web/images/1.jpg');?>" class="img-responsive"></div>
                            <div class="col-xs-8">
                                <label class="bottom-10">Áo Khoác Nỉ Nam Giả Vest Áo Khoác Nỉ Nam Giả Vest Áo Khoác Nỉ Nam Giả Vest</label>
                                <div class="row bottom-5">
                                    <label class="col-xs-4 book-label">SỐ LƯỢNG</label>
                                    <div class="col-xs-3">
                                        <input type="number" required="required" class="col-xs-12" min="1" value="1">
                                    </div>
                                </div>
                                <div class="row bottom-5">
                                    <label class="col-xs-4 book-label">KÍCH THƯỚC</label>
                                    <div class="col-xs-8 size">
                                        <input type="radio" id="size-1-3" name="size" value="S"/>
                                        <label for="size-1-3"><div class="size">S</div></label>
                                        <input type="radio" id="size-2-3" name="size" value="M"/>
                                        <label for="size-2-3"><div class="size">M</div></label>
                                        <input type="radio" id="size-3-3" name="size" value="L"/>
                                        <label for="size-3-3"><div class="size">L</div></label>
                                    </div>
                                </div>
                                <div class="row bottom-5">
                                    <label class="col-xs-4 book-label">MÀU SẮC</label>
                                    <div class="col-xs-8">
                                        <input type="radio" id="color-1-3" name="color" value="1"/>
                                        <label for="color-1-3"><div class="color" style="background-color: #11121E"></div></label>
                                        <input type="radio" id="color-2-3" name="color" value="2"/>
                                        <label for="color-2-3"><div class="color" style="background-color: #B5AE9E"></div></label>
                                        <input type="radio" id="color-3-3" name="color" value="3"/>
                                        <label for="color-3-3"><div class="color" style="background-color: #402E2A"></div></label>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </td>
                    <td>560,000</td>
                    <td>560,000</td>
                </tr>
                <tr>
                    <td colspan="3" class="center">
                        <a href="#" class="btn blue">Thanh toán</a>
                    </td>
                    <td>
                        1,680,000
                    </td>
                </tr>
            </tbody>
        </table>
    </form>
</div>